CKEditor

Description

<jp-ckeditor> is a text editor form component.

It's a wrapper around https://ckeditor.com/.

---

Attributes

Name	Required	Type	Description
service		ImageService	service that handles image adding
value		string	setter
options		Object	CKEditor config
id		string	unique identifier
name	✓	string	name of the form control
label		string	shows at the top
height		string	defines the height of the editable area
width		string	defines the width of the editable area

---

Interfaces

ImageService

Defines the accepted file types and provides a method to upload a file.

---

Properties

Name	Required	Type	Description
uploadFile		function	uploads a file and returns a promise which is a string that represents an identifier for the image

---

Dependencies

In order for this component to work you have to include the following

<script src="https://cdn.ckeditor.com/ckeditor5/41.2.1/super-build/ckeditor.js"></script>

---

Slots

This component does not have any slots.

---

Methods

• getValue
  • returns form field value

---

Events

• value
  • triggers when value of the editor changes

---

Demo

Live Editor

// import '@jaspero/web-components/ckeditor.wc.js';
// import '@jaspero/web-components/ckeditor.css';

<jp-ckeditor value="<p>Blup</p>"></jp-ckeditor>

Result

Loading...

---